<!--仓库调拨新增/编辑组件-->
<template>
    <div>
        <el-form :model="model" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
            <el-row>
                <el-col :span="8">
                    <el-form-item label="调拨编码" prop="Number">
                        <el-input v-model="model.Number" placeholder="请输入编码"></el-input>
                    </el-form-item>
                </el-col>

                <el-col :span="8">
                    <el-form-item label="调出仓库" prop="ExWareHouseName">
                        <el-select :value="model.ExWareHouseName" v-loading="ExWareHouseisLoading"
                            @change="ExWareHouseChange" @focus="ExWareHouseSelect" placeholder="请选择调出仓库">
                            <el-option v-for="item in ExWareHouseSelectData" :key="item.Id" :label="item.WarehouseName"
                                :value="item"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>

                <el-col :span="8">
                    <el-form-item label="调入仓库" prop="WareHouseName" label-width="110px">
                        <el-select :value="model.WareHouseName" v-loading="WareHouseisLoading" @change="WareHouseChange"
                            @focus="WareHouseSelect" placeholder="请选择调入仓库">
                            <el-option v-for="item in WareHouseSelectData" :key="item.Id" :label="item.WarehouseName"
                                :value="item"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col :span="8">
                    <el-form-item label="经办人" prop="EmployeesName">
                        <el-select v-model="model.EmployeesName" v-loading="EmployeesisLoading" @change="EmployeesChange"
                            @focus="EmployeesSelect" placeholder="请选择经办人">
                            <el-option v-for="item in EmployeesSelectData" :key="item.Id" :label="item.Name"
                                :value="item"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>

                <el-col :span="8">
                    <el-form-item label="调拨日期" prop="WareHouseDate">
                        <el-date-picker type="date" v-model="model.WareHouseDate" placeholder="请选择领料日期"
                            value-format="yyyy-MM-dd"></el-date-picker>
                    </el-form-item>
                </el-col>

                <el-col :span="8">
                    <el-form-item label="订单状态" prop="Status">
                        <el-select v-model="model.Status" placeholder="请选择订单状态">
                            <el-option label="未审核" value="0"></el-option>
                            <el-option label="已审核" value="1"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col :span="8">
                    <el-form-item label="制单人" prop="Creator">
                        <el-input v-model="model.Creator" :readonly="true"></el-input>
                    </el-form-item>
                </el-col>

                <el-col :span="8">
                    <el-form-item label="备注" prop="Remark">
                        <el-input v-model="model.Remark" placeholder="请输入备注"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>

        <div class="page-section">
            <div class="page-tool">
                <el-button type="primary" plain icon="el-icon-plus" @click="addItem">新增</el-button>
                <el-button type="danger" plain icon="el-icon-delete" @click="delsItem">删除</el-button>
            </div>
            <!--表单-->
            <el-table :data="ItemData" v-loading="isLoading" height="360px">
                <el-table-column type="selection" width="55"></el-table-column>
                <el-table-column fixed prop="ItemId" label="物料编号" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="ItemName" label="物料名称" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="Spec" label="规格" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="UnitOfMeasure" label="单位" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="CurrCount" label="库存" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="Amount" label="金额" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="TaxPrice" label="含税单价" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="TaxAmount" label="含税金额" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column label="数量" :show-overflow-tooltip="true">
                    <template slot-scope="scope">
                        <el-input v-model="scope.row.Count" @change="CountInput(scope.row)"></el-input>
                    </template>
                </el-table-column>
                <el-table-column label="单价" :show-overflow-tooltip="true">
                    <template slot-scope="scope">
                        <el-input v-model="scope.row.Price" @change="PriceInput(scope.row)"></el-input>
                    </template>
                </el-table-column>
                <el-table-column label="税率" :show-overflow-tooltip="true">
                    <template slot-scope="scope">
                        <el-input v-model="scope.row.Tax" @change="TaxInput(scope.row)"></el-input>
                    </template>
                </el-table-column>
                <el-table-column label="备注" :show-overflow-tooltip="true">
                    <template slot-scope="scope">
                        <el-input v-model="scope.row.Remark"></el-input>
                    </template>
                </el-table-column>
                <el-table-column label="操作" :show-overflow-tooltip="true" width="120px">
                    <template slot-scope="scope">
                        <el-button type="text" @click="delItem(scope.row)">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </div>
        <div style="text-align:right;margin:10px">
            <el-button type="primary" @click="submitForm">{{ isUpdate ? '立即保存' : '立即创建' }}</el-button>
            <el-button @click="resetForm">重置</el-button>
        </div>
        <!--对话框-->
        <el-dialog append-to-body :close-on-click-modal="false" title="选择产品" :visible.sync="dialogDomain" width="60%">
            <SelectedItemFourStock @callback="Callback" :WareHouseId="this.model.ExWareHouseId.toString()"
                :ItemList="this.ItemData" v-if="dialogDomain"></SelectedItemFourStock>
        </el-dialog>
    </div>
</template>

<script>
import SelectedItemFourStock from '@/views/Product/ProductView/components/SelectedItemFourStock.vue'
export default {
    components: {
        SelectedItemFourStock
    },
    props: {
        model: {
            require: true,
            type: Object
        },
        isUpdate: {
            require: true,
            type: Boolean
        }
    },
    data() {
        return {
            WareHouseisLoading: false,
            ExWareHouseisLoading: false,
            EmployeesisLoading: false,
            ExWareHouseSelectData: [],
            WareHouseSelectData: [],
            EmployeesSelectData: [],
            ItemData: [],
            isLoading: false,
            dialogDomain: false,
            rules: {
                Number: { required: true, message: '请输入调拨编号', trigger: 'blur' },
                ExWareHouseName: { required: true, message: '请选择调出仓库' },
                WareHouseName: { required: true, message: '请选择调入仓库' },
                Status: { required: true, message: '请选择状态' },
                WareHouseDate: { required: true, message: '请选择调拨日期', trigger: 'blur' },
                EmployeesName: { required: true, message: '请选择经办人' }
            }
        }
    },
    //创建时
    created() {
        //如果为编辑状态
        if (this.isUpdate) {
            this.GetWareHouseAllocationIdAsync(this.model.Id, this.model.WareHouseId)
        }
        else {
            this.model.Creator = localStorage.userName
        }
    },
    methods: {
        //提交按钮
        submitForm() {
            this.$refs['ruleForm'].validate((valid) => {
                if (valid) {
                    if (this.ItemData.length > 0) {
                        var isAllCountValid = true
                        var positiveIntegerRegex = /^[1-9]\d*$/; // 正整数的正则表达式
                        for (var i = 0; i < this.ItemData.length; i++) {
                            if (!positiveIntegerRegex.test(this.ItemData[i].Count)) {
                                isAllCountValid = false
                                break
                            }
                        }
                        // 所有的 Count 都是正整数，可以提交表单
                        if (isAllCountValid) {
                            if (this.isUpdate) {
                                this.put()
                            }
                            else {
                                this.add()
                            }

                        } else {
                            this.showNotify('数量必须为正整数！')
                            return false
                        }
                    }
                    else {
                        this.showNotify('请添加产品')
                        return false
                    }

                }
                else {
                    this.showNotify('请输入必填项')
                    return false
                }
            })
        },
        //重置按钮
        resetForm() {
            this.$refs['ruleForm'].resetFields()
        },
        //添加产品
        addItem() {
            if (this.model.ExWareHouseName == '') {
                this.showNotify('请先选择调出仓库')
            }
            else {
                this.dialogDomain = true
            }
        },
        //批量删除产品
        delsItem() {
            if (this.$refs.dataForm.selection.length <= 0) {
                this.addItem.showNotify('请选择一项')
                return
            }
            this.$refs.dataForm.selection.forEach(row => {
                const index = this.dataForm.indexOf(row)
                this.dataForm.splice(index, 1)
            })
        },
        //删除产品行
        delItem(model) {
            let index = this.ItemData.indexOf(model)
            this.ItemData.splice(index, 1)
        },
        //调出仓库选择下拉框
        ExWareHouseSelect() {
            this.ExWareHouseisLoading = true
            this.$http.get('/api/Warehouse/GetAll')
                .then((res) => {
                    this.ExWareHouseSelectData = res.Data
                    this.ExWareHouseisLoading = false
                })
        },
        //调出仓库选择下拉框回调
        ExWareHouseChange(model) {
            if (model.WarehouseName != this.model.WareHouseName) {
                this.model.ExWareHouseId = model.Id
                this.model.ExWareHouseName = model.WarehouseName
            }
            else {
                this.showNotify('出库仓和入库仓不能为同一个仓库！')
                return
            }
        },
        //调入仓库选择下拉框
        WareHouseSelect() {
            this.WareHouseisLoading = true
            this.$http.get('/api/Warehouse/GetAll')
                .then((res) => {
                    this.WareHouseSelectData = res.Data
                    this.WareHouseisLoading = false
                })
        },
        //调入仓库选择下拉框回调
        WareHouseChange(model) {
            if (model.WarehouseName != this.model.ExWareHouseName) {
                this.model.WareHouseId = model.Id
                this.model.WareHouseName = model.WarehouseName
            }
            else {
                this.showNotify('出库仓和入库仓不能为同一个仓库！')
                return
            }
        },
        //经办人选择下拉框
        EmployeesSelect() {
            this.EmployeesisLoading = true
            this.$http.get('/api/Employees/GetAll')
                .then((res) => {
                    this.EmployeesSelectData = res.Data
                    this.EmployeesisLoading = false
                })
        },
        //经办人选择下拉框回调
        EmployeesChange(model) {
            this.model.EmployeesName = model.Name
            this.model.EmployeesId = model.Id
        },
        //选择产品对话框回调
        Callback() {
            this.dialogDomain = false
            let arr = []
            this.ItemData.map(x => {
                var obj = new Object()
                //处理所需字段
                this.$set(obj, 'ItemId', x.ItemId)
                this.$set(obj, 'ItemCode', x.ItemCode)
                this.$set(obj, 'ItemName', x.ItemName)
                this.$set(obj, 'Spec', x.Spec)
                this.$set(obj, 'UnitOfMeasure', x.UnitOfMeasure)
                this.$set(obj, 'CurrCount', x.CurrCount)
                this.$set(obj, 'Amount', x.Amount)
                this.$set(obj, 'TaxPrice', x.TaxPrice)
                this.$set(obj, 'TaxAmount', x.TaxAmount)
                this.$set(obj, 'Count', 0)
                this.$set(obj, 'Price', x.SalePrice)
                this.$set(obj, 'Tax', 0)
                this.$set(obj, 'Remark', x.Remark)
                arr.push(obj)
            })
            this.ItemData = arr
        },
        //立即创建
        add() {
            this.$http.postForm('/api/WareHouseAllocation', { model: this.model, WareHouseAllocationItemString: JSON.stringify(this.ItemData) }, { loading: this.$loading() })
                .then((res) => {
                    this.$emit('callback')
                })
        },
        //立即保存
        put() {
            this.$http.putForm('/api/WareHouseAllocation', { model: this.model, WareHouseAllocationItemString: JSON.stringify(this.ItemData) }, { loading: this.$loading() })
                .then((res) => {
                    this.$emit('callback')
                })
        },
        //数量输入框回调
        CountInput(model) {
            model.Count = parseFloat(model.Count) // 删除前导零
            if (!model.Count) {
                model.Count = 0
            }
            else {
                var positiveIntegerRegex = /^[0-9]\d*$/ // 正整数的正则表达式
                if (!positiveIntegerRegex.test(model.Count)) {
                    this.showNotify('请输入正整数！')
                    model.Count = 0
                }
            }

            if (model.Count > model.CurrCount) {
                model.Count = model.CurrCount
                this.showNotify('超出当前库存，请及时补货！')
            }
            else {
                model.Amount = (parseFloat(model.Price) * parseFloat(model.Count)).toFixed(2)
                model.TaxPrice = (parseFloat(model.Price) + parseFloat(model.Price) * parseFloat(model.Tax)).toFixed(2)
                model.TaxAmount = (parseFloat(model.TaxPrice) * parseFloat(model.Count)).toFixed(2)
            }
        },
        //单价输入框回调
        PriceInput(model) {
            model.Price = parseFloat(model.Price) // 删除前导零
            if (!model.Price) {
                model.Price = 0.00
            }
            else {
                var positiveIntegerRegex = /^[0-9]*\.?[0-9]{0,2}$/
                if (!positiveIntegerRegex.test(model.Price)) {
                    this.showNotify('无效的输入，单价或税率必须为数字！')
                    model.Price = 0.00
                }
            }
            model.Price = (model.Price).toFixed(2)
            model.Amount = (parseFloat(model.Price) * parseFloat(model.Count)).toFixed(2)
            model.TaxPrice = (parseFloat(model.Price) + parseFloat(model.Price) * parseFloat(model.Tax)).toFixed(2)
            model.TaxAmount = (parseFloat(model.TaxPrice) * parseFloat(model.Count)).toFixed(2)
        },
        //税率输入框回调
        TaxInput(model) {
            model.Tax = parseFloat(model.Tax) // 删除前导零
            if (!model.Tax) {
                model.Tax = 0.00
            }
            else {
                var positiveIntegerRegex = /^[0-9]*\.?[0-9]*$/
                if (!positiveIntegerRegex.test(model.Tax)) {
                    this.showNotify('无效的输入，单价或税率必须为数字！')
                    model.Tax = 0.00
                }
            }
            model.Tax = (model.Tax).toFixed(1)
            model.Amount = (parseFloat(model.Price) * parseFloat(model.Count)).toFixed(2)
            model.TaxPrice = (parseFloat(model.Price) + parseFloat(model.Price) * parseFloat(model.Tax)).toFixed(2)
            model.TaxAmount = (parseFloat(model.TaxPrice) * parseFloat(model.Count)).toFixed(2)
        },
        //根据仓库调拨编号和仓库编号获取仓库调拨明细表
        GetWareHouseAllocationIdAsync(WareHouseAllocationId,WareHouseId){
            this.isLoading = true
            this.$http.get('/api/WareHouseAllocation/GetWareHouseAllocationIdAsync', {
                params: {
                    WareHouseAllocationId: WareHouseAllocationId,
                    WareHouseId: WareHouseId
                }
            })
                .then((res) => {
                    console.log(res.Data)
                    this.ItemData = res.Data
                    this.isLoading = false
                })
        }

    }
}
</script>

<style></style>